/**
 * 表格边框类型设置组件
 */
function scTableBorderTypeSetting(){
    var com = scCommon.instance();
    var crEle = com.crEle;
    
    var list = [
        {label: "左框线", icon: resource.borderLeft, value:"borderLeft"},
        {label: "右框线", icon: resource.borderRight, value:"borderRight"},
        {label: "上框线", icon: resource.borderTop, value:"borderTop"},
        {label: "下框线", icon: resource.borderBottom, value:"borderBottom"},
        {label: "无框线", icon: resource.borderNone, value:"borderNone"},
        {label: "外框线", icon: resource.borderOutside, value:"borderOutside"}
    ];

    var listener = null;

    /**
     * 创建视图
     * @param{*} option
     */
    this.createView = function(option){
        option = option ? option : {};
        listener = option.listener;

        var box = crEle(null, "sc-tableborder-setting");
        var ul = crEle("ul");
        
        let item = null;
        for(let i in list){
            item = list[i];

            let li = crEle("li");
            let title = crEle("span");

            title.innerText = item.label;

            if(item.icon){
                let wrap = crEle("div", "sc-img-wrap");
                let img = crEle("img");
                
                img.src = item.icon;

                wrap.appendChild(img);
                li.appendChild(wrap);
            }

            li.appendChild(title);
            ul.appendChild(li);

            item.node = li;

            li.addEventListener("click", (e)=>{
                let item = list.find(it=>it.node === e.currentTarget);
                if(option.triggerListener){
                    option.triggerListener({
                        borderType: item.value
                    });
                }
                e.stopPropagation();
            });
        }

        box.appendChild(ul);

        return box;
    }

}